<!DOCTYPE html>
<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 
 <link rel="stylesheet" href="../../JavaScript/right.css"/>
 <title>RIGHT: R Interactive Graphics via HTml</title>

 <script src="../../JavaScript/callback.js"></script>
 <script src="../../JavaScript/kinetic-v4.7.0.js"></script>
 <script src="../../JavaScript/structure.js"></script>
 <script src="../../JavaScript/common.js"></script>
 <script src="../../JavaScript/axis.js"></script>
 <script src="../../JavaScript/color.js"></script>
 <script src="../../JavaScript/dot.js"></script>
 <script src="../../JavaScript/bar.js"></script>
 <script src="../../JavaScript/node_event.js"></script>
 <script src="../../JavaScript/menu.js"></script>
 <script src="../../JavaScript/table.js"></script>
 <script src="../../JavaScript/legend.js"></script>
</head>
<body>
<script> var mainArr1 = createMainStructure('../../JavaScript/_sub.diamonds.csv');
var mainArr2 = createMainStructure('../../JavaScript/Theoph-from-R.csv');
</script>


 		<div id="content" class = "right-output" >
		<div id="container1" oncontextmenu="return false;"></div>
		<div id="container2" oncontextmenu="return false;"></div>
		<div id="container3" oncontextmenu="return false;"></div>
       </div>

       
       <script>
       
       var axis1 = new Axis(1, mainArr1, 'carat', 'table', {});
       var s1 = new Dot(axis1, mainArr1, 'carat', 'depth', {subSet: 'price < 5000 && carat >1'});
       var s3 = new Dot(axis1, mainArr1, 'carat', 'table', {baseColor: 'blue'});
     
       
       var hobj1 = new ddply(mainArr1, ['carat', 'color'], {});
       var axis2 = new Axis(2, hobj1, 'carat', 'frequency', {legend:'color', position: 'left'});
       var s2 = new Bar(axis2, hobj1, 'carat', 'frequency',{});
       
       var hobj2 = new ddply(mainArr2, ['conc'], {});
       var axis3 = new Axis(3, hobj2, 'conc', 'frequency', {legend:'conc', position: 'left'});
       var s3 = new Bar(axis3, hobj2, 'conc', 'frequency',{});
       var AllAxisObjArr = [axis1,axis2, axis3]; // this is global for redrawing in hideselected.
       eventTrigger(AllAxisObjArr);
       </script>
       <script> makeTable(1, mainArr1, 200);</script>
       <div id="footer">
       <p id="copyright">&copy; 2013 - <a href="#">The RIGHT team</a></p>
       <p id="dont-delete-this">E-mail : <a href="mailto:right-user@googlegroups.com">right-user@googlegroups.com</a></p>
       </div>
       
</body>
</html>